<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
    <title>Virus Bacteria Interaction Prediction</title>
    <link rel="stylesheet" type="text/css" href="lib/css/bootstrap.min.css"/>
    <link rel="stylesheet" type="text/css" href="lib/css/jquery-ui.min.css"/>
    <link rel="stylesheet" type="text/css" href="lib/jqwidgets/styles/jqx.base.css" />
    <link rel="stylesheet" type="text/css" href="css/styles.css"/>
    <link rel="stylesheet" type="text/css" href="lib/css/custom_new.css">
    
    <script type="text/javascript" src="lib/js/d3.js"></script>
    <script type="text/javascript" src="lib/js/jquery-1.11.2.min.js"></script>
    <script type="text/javascript" src="lib/js/jquery-ui.min.js"></script>
    <script type="text/javascript" src="lib/js/bootstrap.min.js"></script>
    <script type="text/javascript" src="lib/js/math.min.js"></script>
    <script type="text/javascript" src="lib/jqwidgets/jqx-all.js"></script>
</head>


<body>
	
<div id="tooltip1" class="hidden"><p><span id="value"></div>

<div id="container-id-1" style="width: 1670px; height: 1000px; clear: both;">
	<div class="sidebar_wrapper" style="float: left; width: 300px; height: 1000px; overflow: hidden; display: block; border-right: 1px solid grey;">
		<div class="title_section">
			<img class="title_image" src="logo.jpg" alt="" style="width: 290px; margin-left: 2px; margin-top: 5px;">
		</div>
		
		<div class="reorder_section" style="margin: 1px; margin-top: 10px; padding:2px; font-size: 11px; border: 0.5px solid grey;">
			<div id='jqxWidget'><label>Select the Virus for visualization: </label><div id="listbox"></div></div>
			
			<div class="opacity_slider_container" style="margin-top: 5px;">
				<div ><label for="topAmount"># of top Hosts: </label><input type="text" value="25" id="topAmount" readonly style="border:0; font-weight:bold; width: 50px;"></div>
				<div id="topSlider" style="width: 290px;"></div>
			</div>
			<div class="opacity_slider_container" style="margin-top: 5px;">
				<div ><label for="cutoffAmount">Max distance &lt;= </label><input type="text" value="1" id="cutoffAmount" readonly style="border:0; font-weight:bold; width: 50px;"></div>
				<div id="cutoffSlider" style="width: 290px;"></div>
			</div>
			<div class="btn-group gene_search_button" data-toggle="buttons" style="margin-top: 10px;">
				<div><button id="okBtn" class="sidebar_text btn btn-primary submit_gene_button" type="button" disabled="true" onclick="updateData()" style="float: left; padding-top: 6px; padding-bottom: 6px;">OK</button></div>
			</div>
		</div>
	</div>
	<div id="vizcontainer" style="float: left; width: 1000px; height: 800px; overflow: auto; ">
		<svg id="heatCanvas"></svg> 
	</div>
	<div style="float: left;margin-left: 20px; margin-top: 50px; ">
		<div><b>Consensus Information</b></div>
		<div id="consensusSuperkingdom"></div>
		<div id="consensusPhylum"></div>
		<div id="consensusClass"></div>
		<div id="consensusOrder"></div>
		<div id="consensusFamily"></div>
		<div id="consensusGenus"></div>
		<div id="consensusSpecies"></div>
	</div>
</div>


<footer id="footer_div" class="footer navbar-fixed-bottom">
    <div class="row"><div class="col-xs-12 footer_section"><p class="text-muted">Copyright (C) 2016 Yang Lu &lt;<a href="mailto:ylu465@usc.edu">ylu465@usc.edu</a>&gt; @ Computational and Molecular Biology, Department of Biological Science, University of Southern California, LA, CA 90089, USA </p></div></div>
</footer>

<script type="text/javascript">
	var margin = {top: 200, right: 10, bottom: 10, left: 200};
   var colors = ['#91003F','#9B1A53','#A63467','#B14F7C','#BB6990','#C684A4','#D19EB9','#DBB9CD','#E6D3E1','#F1EEF6','#FFFFFF'];
   
   var virusNameIdxMap = new Object(), hostNameIdxMap = new Object();   
   var topHostNum = 50, cutoff = 1;
   var checkedVirusIdxArr = [], checkedVirusArr = [], hostArr = [], edgeData =[];
   var virusNameArr = ["NC_019843.3.fasta", "NC_004297.0.fasta", "NC_001802.1.fasta", "NC_001722.1.fasta", "NC_002023.0.fasta", "NC_004718.3.fasta", "NC_006998.1.fasta", "AC_000017.1.fasta", "NC_003977.2.fasta", "NC_012532.1.fasta", "NC_045512.2.fasta", "NC_038312.1.fasta", "NC_002728.1.fasta", "NC_006273.2.fasta", "NC_001803.1.fasta", "NC_009333.1.fasta", "NC_001348.1.fasta", "NC_001798.2.fasta", "NC_001538.1.fasta", "NC_001355.1.fasta", "NC_001436.1.fasta", "NC_005219.1.fasta", "NC_001430.1.fasta", "NC_001906.3.fasta", "NC_038311.1.fasta", "NC_010415.1.fasta", "NC_001731.1.fasta", "JX276378.1.fasta", "NC_006307.0.fasta", "NC_001806.2.fasta", "NC_001796.2.fasta", "NC_001611.1.fasta", "NC_003443.1.fasta", "NC_001664.4.fasta", "NC_002549.1.fasta", "NC_004102.1.fasta", "NC_002204.0.fasta", "NC_007605.1.fasta", "NC_004162.2.fasta"];
var hostNameArr = ["NC_019843.3.fasta", "NC_004297.0.fasta", "NC_001802.1.fasta", "NC_001722.1.fasta", "NC_002023.0.fasta", "NC_004718.3.fasta", "NC_006998.1.fasta", "AC_000017.1.fasta", "NC_003977.2.fasta", "NC_012532.1.fasta", "NC_045512.2.fasta", "NC_038312.1.fasta", "NC_002728.1.fasta", "NC_006273.2.fasta", "NC_001803.1.fasta", "NC_009333.1.fasta", "NC_001348.1.fasta", "NC_001798.2.fasta", "NC_001538.1.fasta", "NC_001355.1.fasta", "NC_001436.1.fasta", "NC_005219.1.fasta", "NC_001430.1.fasta", "NC_001906.3.fasta", "NC_038311.1.fasta", "NC_010415.1.fasta", "NC_001731.1.fasta", "JX276378.1.fasta", "NC_006307.0.fasta", "NC_001806.2.fasta", "NC_001796.2.fasta", "NC_001611.1.fasta", "NC_003443.1.fasta", "NC_001664.4.fasta", "NC_002549.1.fasta", "NC_004102.1.fasta", "NC_002204.0.fasta", "NC_007605.1.fasta", "NC_004162.2.fasta"];
var virusHostMat = [[0,52.9899,72.8238,52.8638,43.3123,33.1872,28.0322,30.4943,63.6318,42.2816,34.6543,70.0603,39.5398,28.728,57.0925,24.6918,25.6157,48.4263,1101.96,55.1737,42.9911,90.9412,58.8308,42.7003,68.2085,44.8252,55.5535,44.776,53.1524,34.8008,64.5133,26.8214,44.4057,27.853,34.5348,44.0197,47.2461,28.244,35.5183],
[52.9899,0,86.6516,71.0978,62.503,57.297,53.0472,55.3808,77.201,62.723,57.3516,86.0587,60.3368,53.6681,72.7832,52.229,52.2849,67.1963,1106.5,73.1889,63.3639,101.731,75.5258,63.743,82.8911,65.3059,70.785,62.2557,68.15,58.3083,81.1285,52.595,63.561,53.4003,55.9572,62.93,63.6937,53.8137,57.7043],
[72.8238,86.6516,0,80.4418,78.1043,71.6458,70.2787,71.3559,89.6944,76.3712,75.7292,86.7183,78.3236,70.5792,89.5871,69.3781,70.3391,80.5794,1083.93,81.2537,77.6975,112.549,86.0206,75.3365,93.7755,81.4966,85.7826,79.2095,86.2594,73.564,90.9572,69.7335,82.0641,69.8485,74.1962,77.7622,81.2137,70.6114,73.6705],
[52.8638,71.0978,80.4418,0,58.9903,53.5893,50.5144,51.5129,74.11,59.563,55.0842,78.8432,59.5705,49.3114,72.2546,48.3139,48.9398,62.8802,1102.11,65.5558,59.2848,103.02,67.5809,60.6569,82.6076,62.8733,67.3963,61.5274,68.592,54.2904,74.4028,50.059,62.4849,49.855,55.0646,60.526,63.6595,50.2295,53.3979],
[43.3123,62.503,78.1043,58.9903,0,45.6498,41.3531,43.9205,68.5453,51.7226,47.5404,74.5313,49.411,41.9878,63.8905,38.5767,39.0531,57.6869,1100.86,61.0789,53.1871,95.3371,62.3769,51.1656,76.9022,54.4793,63.8369,53.533,59.502,47.0127,72.8329,39.9151,51.9227,40.6073,46.8975,53.402,56.6508,42.4751,46.3585],
[33.1872,57.297,71.6458,53.5893,45.6498,0,31.9668,35.0765,65.7316,46.0613,35.5348,72.615,43.4815,32.5416,59.1043,29.9683,31.5051,51.0818,1101.56,56.9842,45.9588,93.2293,61.0589,44.4642,71.3326,48.0383,57.0665,48.4015,57.3754,38.3565,68.2148,31.3605,48.4558,32.1081,39.1496,46.7891,51.1104,32.636,39.3166],
[28.0322,53.0472,70.2787,50.5144,41.3531,31.9668,0,27.9188,61.7544,39.8729,34.7837,68.6531,38.0817,23.8328,55.8138,20.5558,21.4005,46.4458,1101.26,52.5121,41.1202,90.6701,56.1703,40.1592,67.5166,46.6513,54.3514,43.9649,51.5143,32.0354,64.3933,11.398,42.8049,23.7101,33.3643,41.5045,45.6522,25.0339,32.5356],
[30.4943,55.3808,71.3559,51.5129,43.9205,35.0765,27.9188,0,62.4288,43.1757,37.4529,69.8028,41.2223,22.0828,57.7215,22.573,24.7994,42.1877,1101.37,52.7861,41.9204,90.5521,58.6421,42.4239,68.4529,48.6301,50.1726,47.0092,53.8393,29.4164,64.3741,26.3532,45.6056,26.8205,35.2419,41.775,47.9227,23.875,35.3382],
[63.6318,77.201,89.6944,74.11,68.5453,65.7316,61.7544,62.4288,0,68.4336,65.9866,88.1309,68.8606,61.3994,80.555,60.5317,60.9924,73.0094,1098.78,75.0545,70.9404,104.369,78.2204,68.2951,87.8946,74.1101,76.6952,70.8807,75.1787,65.0659,87.3759,61.4554,72.3508,61.6094,66.0731,70.4063,73.1929,62.4054,65.0504],
[42.2816,62.723,76.3712,59.563,51.7226,46.0613,39.8729,43.1757,68.4336,0,47.5152,77.1222,49.6789,40.3131,64.6342,38.5846,38.949,54.9404,1101.2,62.2696,51.8528,95.5697,65.4312,51.5564,74.3969,55.6545,61.1959,54.1868,62.2518,46.0684,70.6918,39.5574,53.6776,39.6886,46.1408,51.9802,56.3012,41.3293,45.7005],
[34.6543,57.3516,75.7292,55.0842,47.5404,35.5348,34.7837,37.4529,65.9866,47.5152,0,73.1264,43.8865,34.8895,59.7541,32.7547,32.7581,52.6232,1099.18,58.0561,47.7477,93.5932,62.4907,46.1348,71.7168,51.6519,59.1567,48.9559,59.3258,40.4622,65.256,33.6997,49.6027,35.2531,39.562,48.033,52.617,35.0286,40.3335],
[70.0603,86.0587,86.7183,78.8432,74.5313,72.615,68.6531,69.8028,88.1309,77.1222,73.1264,0,75.5824,69.1743,87.9741,66.8522,67.4636,78.9911,1092.96,78.4859,75.6256,110.938,79.3894,76.8798,85.094,75.4567,83.9071,76.0407,82.0717,71.377,89.3254,68.458,78.9202,68.5505,72.7113,76.8227,80.5375,68.4213,72.5641],
[39.5398,60.3368,78.3236,59.5705,49.411,43.4815,38.0817,41.2223,68.8606,49.6789,43.8865,75.5824,0,38.6594,60.2265,36.5654,36.7173,55.0843,1105.57,59.8799,50.7266,95.825,64.7948,47.8119,74.9483,53.4396,61.294,52.0844,60.3959,43.3837,68.0025,37.1506,50.4535,38.808,44.2336,50.7916,55.2048,39.3194,44.8668],
[28.728,53.6681,70.5792,49.3114,41.9878,32.5416,23.8328,22.0828,61.3994,40.3131,34.8895,69.1743,38.6594,0,55.8845,18.54,22.0435,36.5228,1102.04,52.035,41.1118,90.4392,57.8123,40.3317,67.3768,46.1733,45.8329,44.0896,52.1518,23.0789,63.0916,22.7524,42.9922,23.7172,32.709,39.8358,46.4918,20.3636,32.1468],
[57.0925,72.7832,89.5871,72.2546,63.8905,59.1043,55.8138,57.7215,80.555,64.6342,59.7541,87.9741,60.2265,55.8845,0,53.9264,53.3021,68.5804,1106.73,73.7436,64.4779,102.568,77.8814,60.8841,85.038,65.9604,73.7769,65.6441,71.9225,59.4661,80.6691,54.5644,61.6183,55.1881,59.0935,64.8523,68.2023,54.9131,60.0524],
[24.6918,52.229,69.3781,48.3139,38.5767,29.9683,20.5558,22.573,60.5317,38.5846,32.7547,66.8522,36.5654,18.54,53.9264,0,16.4099,42.0713,1102.49,51.1136,38.3157,89.5679,55.3692,37.7172,66.6202,43.029,50.1293,41.0408,49.9724,26.2538,61.8812,18.7583,40.7975,19.368,29.8144,39.2426,44.1034,17.9153,29.9568],
[25.6157,52.2849,70.3391,48.9398,39.0531,31.5051,21.4005,24.7994,60.9924,38.949,32.7581,67.4636,36.7173,22.0435,53.3021,16.4099,0,44.3919,1102.31,50.6215,39.3439,90.0831,55.9745,38.6304,66.6596,44.0401,52.237,42.6029,50.272,28.874,61.8826,19.8925,40.8035,19.5747,30.5081,39.8005,44.9974,21.1274,31.2728],
[48.4263,67.1963,80.5794,62.8802,57.6869,51.0818,46.4458,42.1877,73.0094,54.9404,52.6232,78.9911,55.0843,36.5228,68.5804,42.0713,44.3919,0,1102.9,65.3546,55.4928,98.9479,70.3182,56.0304,76.8566,61.4854,46.514,59.4389,65.3881,29.761,74.3993,45.8716,57.4384,45.7419,51.1377,56.0178,60.6451,40.4885,50.2403],
[1101.96,1106.5,1083.93,1102.11,1100.86,1101.56,1101.26,1101.37,1098.78,1101.2,1099.18,1092.96,1105.57,1102.04,1106.73,1102.49,1102.31,1102.9,0,1099.44,1104.24,1107.84,1098.19,1102.69,1107.25,1106.28,1103.86,1100.61,1106.82,1102.68,1106.94,1101.58,1105.53,1102.47,1103.22,1101.83,1103.61,1102.61,1101.7],
[55.1737,73.1889,81.2537,65.5558,61.0789,56.9842,52.5121,52.7861,75.0545,62.2696,58.0561,78.4859,59.8799,52.035,73.7436,51.1136,50.6215,65.3546,1099.44,0,63.7047,99.9777,74.2749,58.8536,81.4653,66.6309,72.3271,64.641,69.1509,56.7755,79.0207,51.4784,65.6239,52.0482,56.1286,62.6765,64.4436,52.0136,57.3248],
[42.9911,63.3639,77.6975,59.2848,53.1871,45.9588,41.1202,41.9204,70.9404,51.8528,47.7477,75.6256,50.7266,41.1118,64.4779,38.3157,39.3439,55.4928,1104.24,63.7047,0,95.1624,66.1835,51.5667,75.9202,55.8581,61.2543,55.7364,61.7084,46.135,70.0304,40.5012,52.7816,40.4936,45.6867,53.9293,56.0594,41.1745,47.2765],
[90.9412,101.731,112.549,103.02,95.3371,93.2293,90.6701,90.5521,104.369,95.5697,93.5932,110.938,95.825,90.4392,102.568,89.5679,90.0831,98.9479,1107.84,99.9777,95.1624,0,105.674,97.0169,102.312,99.5821,102.954,96.8499,100.238,92.3302,107.96,89.9446,95.2044,90.9639,91.591,96.0223,98.6917,91.0562,93.1733],
[58.8308,75.5258,86.0206,67.5809,62.3769,61.0589,56.1703,58.6421,78.2204,65.4312,62.4907,79.3894,64.7948,57.8123,77.8814,55.3692,55.9745,70.3182,1098.19,74.2749,66.1835,105.674,0,65.5616,83.992,67.3227,75.2452,62.5927,70.2327,61.2886,82.8034,56.0702,68.7883,57.3866,61.2547,66.6994,69.5798,57.784,60.5309],
[42.7003,63.743,75.3365,60.6569,51.1656,44.4642,40.1592,42.4239,68.2951,51.5564,46.1348,76.8798,47.8119,40.3317,60.8841,37.7172,38.6304,56.0304,1102.69,58.8536,51.5667,97.0169,65.5616,0,72.4863,54.4351,62.6979,53.6093,60.8301,44.8308,70.7567,39.12,51.402,39.6786,44.5282,51.3047,56.8987,40.4505,45.2812],
[68.2085,82.8911,93.7755,82.6076,76.9022,71.3326,67.5166,68.4529,87.8946,74.3969,71.7168,85.094,74.9483,67.3768,85.038,66.6202,66.6596,76.8566,1107.25,81.4653,75.9202,102.312,83.992,72.4863,0,74.7609,81.1593,74.5153,82.0701,69.2349,86.7525,67.0576,75.1851,67.2205,70.8987,75.1617,79.348,67.0639,71.0237],
[44.8252,65.3059,81.4966,62.8733,54.4793,48.0383,46.6513,48.6301,74.1101,55.6545,51.6519,75.4567,53.4396,46.1733,65.9604,43.029,44.0401,61.4854,1106.28,66.6309,55.8581,99.5821,67.3227,54.4351,74.7609,0,65.4335,56.2263,63.516,50.4963,72.0115,45.9953,57.347,45.4316,51.0541,57.8169,59.3828,44.5596,50.3753],
[55.5535,70.785,85.7826,67.3963,63.8369,57.0665,54.3514,50.1726,76.6952,61.1959,59.1567,83.9071,61.294,45.8329,73.7769,50.1293,52.237,46.514,1103.86,72.3271,61.2543,102.954,75.2452,62.6979,81.1593,65.4335,0,64.0642,70.5491,46.2448,79.5608,53.7947,63.9715,53.4318,57.0303,60.1226,66.7264,49.6077,56.0351],
[44.776,62.2557,79.2095,61.5274,53.533,48.4015,43.9649,47.0092,70.8807,54.1868,48.9559,76.0407,52.0844,44.0896,65.6441,41.0408,42.6029,59.4389,1100.61,64.641,55.7364,96.8499,62.5927,53.6093,74.5153,56.2263,64.0642,0,63.286,47.9051,72.232,42.741,55.4979,43.8686,48.4037,55.1151,56.9946,43.978,48.6677],
[53.1524,68.15,86.2594,68.592,59.502,57.3754,51.5143,53.8393,75.1787,62.2518,59.3258,82.0717,60.3959,52.1518,71.9225,49.9724,50.272,65.3881,1106.82,69.1509,61.7084,100.238,70.2327,60.8301,82.0701,63.516,70.5491,63.286,0,55.9463,79.339,50.9742,62.4526,51.0996,54.8718,61.7888,63.2155,52.1155,55.4714],
[34.8008,58.3083,73.564,54.2904,47.0127,38.3565,32.0354,29.4164,65.0659,46.0684,40.4622,71.377,43.3837,23.0789,59.4661,26.2538,28.874,29.761,1102.68,56.7755,46.135,92.3302,61.2886,44.8308,69.2349,50.4963,46.2448,47.9051,55.9463,0,66.5187,31.1966,47.2969,30.9465,38.8461,45.4298,50.5845,26.0638,38.0633],
[64.5133,81.1285,90.9572,74.4028,72.8329,68.2148,64.3933,64.3741,87.3759,70.6918,65.256,89.3254,68.0025,63.0916,80.6691,61.8812,61.8826,74.3993,1106.94,79.0207,70.0304,107.96,82.8034,70.7567,86.7525,72.0115,79.5608,72.232,79.339,66.5187,0,63.6731,71.6222,62.3878,66.8164,72.1536,71.249,63.3896,66.7336],
[26.8214,52.595,69.7335,50.059,39.9151,31.3605,11.398,26.3532,61.4554,39.5574,33.6997,68.458,37.1506,22.7524,54.5644,18.7583,19.8925,45.8716,1101.58,51.4784,40.5012,89.9446,56.0702,39.12,67.0576,45.9953,53.7947,42.741,50.9742,31.1966,63.6731,0,42.0033,22.4987,32.4389,41.0888,44.614,23.8645,31.6536],
[44.4057,63.561,82.0641,62.4849,51.9227,48.4558,42.8049,45.6056,72.3508,53.6776,49.6027,78.9202,50.4535,42.9922,61.6183,40.7975,40.8035,57.4384,1105.53,65.6239,52.7816,95.2044,68.7883,51.402,75.1851,57.347,63.9715,55.4979,62.4526,47.2969,71.6222,42.0033,0,42.3362,46.1076,54.382,58.041,42.8252,49.159],
[27.853,53.4003,69.8485,49.855,40.6073,32.1081,23.7101,26.8205,61.6094,39.6886,35.2531,68.5505,38.808,23.7172,55.1881,19.368,19.5747,45.7419,1102.47,52.0482,40.4936,90.9639,57.3866,39.6786,67.2205,45.4316,53.4318,43.8686,51.0996,30.9465,62.3878,22.4987,42.3362,0,31.9839,40.46,45.7428,24.4535,32.787],
[34.5348,55.9572,74.1962,55.0646,46.8975,39.1496,33.3643,35.2419,66.0731,46.1408,39.562,72.7113,44.2336,32.709,59.0935,29.8144,30.5081,51.1377,1103.22,56.1286,45.6867,91.591,61.2547,44.5282,70.8987,51.0541,57.0303,48.4037,54.8718,38.8461,66.8164,32.4389,46.1076,31.9839,0,46.2539,49.7376,33.468,39.1477],
[44.0197,62.93,77.7622,60.526,53.402,46.7891,41.5045,41.775,70.4063,51.9802,48.033,76.8227,50.7916,39.8358,64.8523,39.2426,39.8005,56.0178,1101.83,62.6765,53.9293,96.0223,66.6994,51.3047,75.1617,57.8169,60.1226,55.1151,61.7888,45.4298,72.1536,41.0888,54.382,40.46,46.2539,0,57.7382,41.7965,46.8889],
[47.2461,63.6937,81.2137,63.6595,56.6508,51.1104,45.6522,47.9227,73.1929,56.3012,52.617,80.5375,55.2048,46.4918,68.2023,44.1034,44.9974,60.6451,1103.61,64.4436,56.0594,98.6917,69.5798,56.8987,79.348,59.3828,66.7264,56.9946,63.2155,50.5845,71.249,44.614,58.041,45.7428,49.7376,57.7382,0,46.6437,51.6804],
[28.244,53.8137,70.6114,50.2295,42.4751,32.636,25.0339,23.875,62.4054,41.3293,35.0286,68.4213,39.3194,20.3636,54.9131,17.9153,21.1274,40.4885,1102.61,52.0136,41.1745,91.0562,57.784,40.4505,67.0639,44.5596,49.6077,43.978,52.1155,26.0638,63.3896,23.8645,42.8252,24.4535,33.468,41.7965,46.6437,0,33.5552],
[35.5183,57.7043,73.6705,53.3979,46.3585,39.3166,32.5356,35.3382,65.0504,45.7005,40.3335,72.5641,44.8668,32.1468,60.0524,29.9568,31.2728,50.2403,1101.7,57.3248,47.2765,93.1733,60.5309,45.2812,71.0237,50.3753,56.0351,48.6677,55.4714,38.0633,66.7336,31.6536,49.159,32.787,39.1477,46.8889,51.6804,33.5552,0]];
var superkingdomArr = ["unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown"];
var phylumArr = ["unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown"];
var classArr = ["unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown"];
var orderArr = ["unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown"];
var familyArr = ["unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown"];
var genusArr = ["unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown"];
var speciesArr = ["unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown"];
var organismArr = ["unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown", "unknown"];

   for(var hostIdx=0; hostIdx<hostNameArr.length; hostIdx++) hostNameIdxMap[hostNameArr[hostIdx]] = hostIdx;
   for(var virusIdx=0; virusIdx<virusNameArr.length; virusIdx++) virusNameIdxMap[virusNameArr[virusIdx]] = virusIdx;
   console.log("phageToHost finish loading!");
   
   topHostNum = Math.min(25, hostNameArr.length);
   
   $(function() { $( "#topSlider" ).slider({ value:25, min: 1, max: 100, step: 1, slide: function( event, ui ) { $( "#topAmount" ).val( ui.value ); topHostNum = Math.min(ui.value, hostNameArr.length);  } }); }); 
   $(function() { $( "#cutoffSlider" ).slider({ value:1, min: 0, max: 1, step: 0.01, slide: function( event, ui ) { $( "#cutoffAmount" ).val( ui.value ); cutoff = ui.value; } }); });
   
   
   $("#listbox").jqxListBox({width: 290, height: 300, source: virusNameArr, checkboxes: true, filterable: true});
		$("#listbox").on('checkChange', function (event) {
			var items = $("#listbox").jqxListBox('getCheckedItems');
			checkedVirusIdxArr = []; checkedVirusArr = [];
			$.each(items, function (index) { checkedVirusIdxArr.push(this.index); checkedVirusArr.push(this.label); });
			
			if(checkedVirusIdxArr.length > 0) $("#okBtn").prop('disabled', false);
			else $("#okBtn").prop('disabled', true);
   });
   
   var host2organism = [], host2superkingdom = [], host2phylum = [], host2class = [], 
		host2order = [], host2family = [], host2genus = [], host2species = [];
   
   for(var t=0; t<hostNameArr.length; t++){
   		host2organism[hostNameArr[t]] = organismArr[t];
   		host2superkingdom[hostNameArr[t]] = superkingdomArr[t];
   		host2phylum[hostNameArr[t]] = phylumArr[t];
   		host2class[hostNameArr[t]] = classArr[t];
   		host2order[hostNameArr[t]] = orderArr[t];
   		host2family[hostNameArr[t]] = familyArr[t];
   		host2genus[hostNameArr[t]] = genusArr[t];
   		host2species[hostNameArr[t]] = speciesArr[t];
	}
	console.log("hostTaxonomy finish loading!");
	
	var minDist = 1, maxDist = 0, gap=0;
	for(var rowIdx=0; rowIdx<virusHostMat.length; rowIdx++) 
	{
		for(var colIdx=0; colIdx<virusHostMat[0].length; colIdx++)
		{
			if(virusHostMat[rowIdx][colIdx]<minDist) minDist = virusHostMat[rowIdx][colIdx];
			if(virusHostMat[rowIdx][colIdx]>maxDist) maxDist = virusHostMat[rowIdx][colIdx];
		}
	}
	minDist = Math.max(0,minDist-0.1); maxDist = Math.min(1,maxDist+0.1); gap = maxDist-minDist;
	var colorScale = d3.scale.quantile().domain([minDist,maxDist]).range(colors);

	function updateData() {
		topHostNum = Math.min(topHostNum, hostNameArr.length);

		var combinedArr = new Array(virusHostMat[checkedVirusIdxArr[0]].length).fill(0);
		for(var rowIdx=0; rowIdx<checkedVirusIdxArr.length; rowIdx++) {
			for(var colIdx=0; colIdx<virusHostMat[checkedVirusIdxArr[rowIdx]].length; colIdx++) {
				combinedArr[colIdx] += virusHostMat[checkedVirusIdxArr[rowIdx]][colIdx];
			}
		}
		var tmpArr = combinedArr.slice(); 
		var thres = tmpArr.sort().slice(topHostNum-1,topHostNum);

		indiceArr = [];
		for(var colIdx=0; colIdx<combinedArr.length; colIdx++) {
			if(indiceArr.length >= topHostNum) break;
			if(combinedArr[colIdx] <= thres) { indiceArr.push({"idx":colIdx, "dist":combinedArr[colIdx] }); }
		}
		
		hostArr = []; edgeData =[];
		for(var colIdx=0; colIdx<indiceArr.length; colIdx++) {
			var realColIdx = indiceArr[colIdx].idx;
			hostArr.push(hostNameArr[realColIdx]);
			
			for(var rowIdx=0; rowIdx<checkedVirusIdxArr.length; rowIdx++) { edgeData.push({"row":rowIdx, "col":hostArr.length-1, 
				"value":virusHostMat[checkedVirusIdxArr[rowIdx]][realColIdx]<=cutoff?virusHostMat[checkedVirusIdxArr[rowIdx]][realColIdx]:1}); }
		}
		
		pathArr = [];
		for(var colIdx=0; colIdx<hostArr.length; colIdx++) { pathArr.push([host2superkingdom[hostArr[colIdx]],host2phylum[hostArr[colIdx]],host2class[hostArr[colIdx]],host2order[hostArr[colIdx]],host2family[hostArr[colIdx]],host2genus[hostArr[colIdx]],host2species[hostArr[colIdx]]]); }
		//rootNode = 	convertToHierarchy(pathArr);
		//consensusArr = getConsensusTaxonomy(rootNode); 
		
		$("#consensusSuperkingdom").text("Superkingdom: "+getConsensusItem(pathArr,0));
		$("#consensusPhylum").text("Phylum: "+getConsensusItem(pathArr,1));
		$("#consensusClass").text("Class: "+getConsensusItem(pathArr,2));
		$("#consensusOrder").text("Order: "+getConsensusItem(pathArr,3));
		$("#consensusFamily").text("Family: "+getConsensusItem(pathArr,4));
		$("#consensusGenus").text("Genus: "+getConsensusItem(pathArr,5));
		$("#consensusSpecies").text("Species: "+getConsensusItem(pathArr,6));
		
		var cellSize = 25, legendElementWidth = cellSize*2, 
			width = Math.max(hostArr.length*cellSize, 1000 ), height = Math.max(checkedVirusIdxArr.length*cellSize, 700 );
		
		console.log();
		
		d3.selectAll(".canvasSvg").remove(); 
		var svg = d3.select("#heatCanvas").style("float", "left").attr("width", width).attr("height", height)
			.append("g").attr('class', "canvasSvg").attr("transform", "translate(" + margin.left + "," + margin.top + ")");
			
		var rowLabels = svg.append("g").selectAll(".rowLabelg").data(checkedVirusArr).enter().append("text")
			.text(function (d) { return d; }).attr("x", 0).attr("y", function (d, i) { return i * cellSize; })
      		.style("text-anchor", "end").attr("transform", "translate(-6," + cellSize / 1.5 + ")")
      		.attr("class", function (d,i) { return "rowLabel mono r"+i;} ) ;
      		
      	var colLabels = svg.append("g").selectAll(".colLabelg").data(hostArr).enter().append("text")
      		.text(function (d) { return d; }).attr("x", 0).attr("y", function (d, i) { return i * cellSize; })
      		.style("text-anchor", "left").attr("transform", "translate("+cellSize/2 + ",-6) rotate (-90)")
      		.attr("class",  function (d,i) { return "colLabel mono c"+i;} );
      	
      	var heatMap = svg.append("g").attr("class","g3").selectAll(".cellg").data(edgeData).enter().append("rect")
			.attr("x", function(d) { return d.col * cellSize; }).attr("y", function(d) { return d.row * cellSize; })
        	.attr("class", function(d){return "cell cell-border cr"+(d.row)+" cc"+(d.col);})
        	.attr("width", cellSize).attr("height", cellSize).style("fill", function(d) { return colorScale(d.value); })
			.on("mouseover", function(d){
				d3.selectAll(".cell").filter(function(el) {return d.row == el.row || d.col == el.col; }).classed("cell-hover",true);
				d3.selectAll(".rowLabel").classed("text-highlight",function(r,ri){ return ri==d.row;});
				d3.selectAll(".colLabel").classed("text-highlight",function(c,ci){ return ci==d.col;});
				
				d3.select("#tooltip1").style("left", (d3.event.pageX+10) + "px").style("top", (d3.event.pageY-10) + "px")
					.html("Host Information: "+
						"<br> Superkingdom: "+ host2superkingdom[hostArr[d.col]] +
						"<br> Phylum: "+ host2phylum[hostArr[d.col]] +
						"<br> Class: "+ host2class[hostArr[d.col]] +
						"<br> Order: "+ host2order[hostArr[d.col]] +
						"<br> Family: "+ host2family[hostArr[d.col]] +
						"<br> Genus: "+ host2genus[hostArr[d.col]] +
						"<br> Species: "+ host2species[hostArr[d.col]] +
						"<br> Organism: "+ host2organism[hostArr[d.col]] +
						"<br> distance:"+d.value);  
                d3.select("#tooltip1").classed("hidden", false);
			})
			.on("mouseout", function(d){
				d3.selectAll(".cell").filter(function(el) {return d.row == el.row || d.col == el.col; }).classed("cell-hover",false);
				d3.selectAll(".rowLabel").classed("text-highlight",false);
				d3.selectAll(".colLabel").classed("text-highlight",false);
				d3.select("#tooltip1").classed("hidden", true);
			});
      		
      	var legend = svg.selectAll(".legend").data([minDist,minDist+0.1*gap,minDist+0.2*gap,minDist+0.3*gap,minDist+0.4*gap,minDist+0.5*gap,minDist+0.6*gap,minDist+0.7*gap,minDist+0.8*gap,minDist+0.9*gap,maxDist]).enter().append("g").attr("class", "legend");
		legend.append("rect").attr("x", function(d, i) { return legendElementWidth * i-margin.left; }).attr("y", (cellSize*2) - margin.top)
    		.attr("width", legendElementWidth).attr("height", cellSize)
    		.style("fill", function(d, i) { return colors[i]; });
    
    	legend.append("text").text(function(d) { return d3.format(".2f")(d); }).style("text-anchor", "left")
    		.attr("x", function(d, i) { return legendElementWidth * i-margin.left; }).attr("y", (cellSize*4)- margin.top);
	}
	
	function getConsensusItem(pathArr, idx)
	{
		var node = {id:"root", cnt:0, children:{}};
		for (var i = 0; i < pathArr.length; i++) 
		{
			var path = pathArr[i];
			node.cnt ++;
			item = path[idx];
			if (!node.children[item]) node.children[item] = {id:item, cnt:0, children:{}};
			node.children[item].cnt ++;
		}
		
		var arr = Object.keys( node.children ).map(function ( key ) { return node.children[key].cnt; });
		var ratio = 100;
		if(math.sum(arr) > 0) ratio = Math.max.apply(Math,arr)*100/math.sum(arr);
		maxItem = Object.keys(node.children)[arr.indexOf(Math.max.apply(Math,arr))];
		return node.children[maxItem].id+" ("+String(Math.round(ratio * 100) / 100)+"%)";
	}
	
	function convertToHierarchy(pathArr) {
		var rootNode = {id:"root", cnt:0, children:{}};
		for (var i = 0; i < pathArr.length; i++) {
			var path = pathArr[i];
			buildNodeRecursive(rootNode, path, 0);
		}
		return rootNode;
	}
	
	function buildNodeRecursive(node, path, idx) {
		if (idx < path.length) {
			node.cnt ++;
			item = path[idx];			
			if (!node.children[item]) node.children[item] = {id:item, cnt:0, children:{}};
			buildNodeRecursive(node.children[item], path, idx + 1);
		}
	}
	
	function getConsensusTaxonomy(currNode) {
		if(currNode.children && Object.keys(currNode.children).length > 0) {
			var arr = Object.keys( currNode.children ).map(function ( key ) { return currNode.children[key].cnt; });
			//console.log(arr + " : " +arr.length);
			//console.log(arr + " : " +Math.max.apply(Math,arr) +" : " + arr.indexOf(Math.max.apply(Math,arr)));
			//console.log(Math.max.apply(Math,arr) + " / " +math.sum(arr));
			
			var ratio = 100;
			if(math.sum(arr) > 0) ratio = Math.max.apply(Math,arr)*100/math.sum(arr);
			
			maxItem = Object.keys(currNode.children)[arr.indexOf(Math.max.apply(Math,arr))];
			
			returnArr = [currNode.children[maxItem].id+" ("+String(Math.round(ratio * 100) / 100)+"%)"];
			returnArr = returnArr.concat(getConsensusTaxonomy(currNode.children[maxItem]));
			return returnArr;
		}
		return [currNode.id+" (100%)"];
	}
	

</script>

</body>
</html>